<style lang="less" scoped>
// .van-tabbar-item__text {
//   font-size: 1.3rem !important;
// }
.tabbar {
  z-index: 100;
}
.van-tabbar{
	background-color: inherit !important;
}
.van-tabbar-item--active{
	background-color: inherit !important;
}
</style>
<template>
  <van-tabbar
    class="tabbar"
    v-model="active"
    :active-color="activeColor"
    :inactive-color="inactiveColor"
    title-class="fs-14"
    @change="tabChange"
  >
    <van-tabbar-item v-for="item in tabbar" :key="item.id">
      <span :style="{fontSize:fontSize==1?'13px':'16px'}">{{item.text}}</span>
      <template #icon="props">
        <!-- <van-icon :name="props.active ? item.activeIcon : item.inactiveIcon" /> -->
		<img style="width: 22px;" :src="props.active ? item.activeIcon : item.inactiveIcon" >
      </template>
    </van-tabbar-item>
  </van-tabbar>
</template>
<script>
import { Tabbar, TabbarItem } from "vant";
let policyActive = 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-767674fd-0f0e-4801-90e6-bef27c2e36df/ca6636da-3068-4492-9967-d525cda3b698.png'
export default {
  components: {
    [Tabbar.name]: Tabbar,
    [TabbarItem.name]: TabbarItem,
  },
  data() {
    return {
	  fontSize:localStorage.getItem('fontSize') || 1,
      active: 0,
      activeColor: "#ffffff",
      inactiveColor: "#1093c1",
      tabbar: [
        {
          id: 0,
          inactiveIcon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-767674fd-0f0e-4801-90e6-bef27c2e36df/d788d69c-3925-4c52-a71f-372d2d40eabe.png',
          activeIcon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-767674fd-0f0e-4801-90e6-bef27c2e36df/78b4a244-a617-4b0b-90ed-7cdbb3da0feb.png',
          text: "政策",
        },
        {
          id: 1,
          inactiveIcon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-767674fd-0f0e-4801-90e6-bef27c2e36df/4c35aeb2-a3cd-451c-ab81-16c9e368d3b7.png',
          activeIcon: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-767674fd-0f0e-4801-90e6-bef27c2e36df/6c8025a1-c97f-49c2-b264-393b6546ea33.png',
          text: "我的",
        }
      ],
    };
  },
  watch:{
      $route(to,from){
        // console.log('from',from.path);//从哪来
        // console.log('to',to.path);//到哪去
      }
  },
  created() {
  	const _this = this;
  	_this.initActive();
	this.bus.$on('refreshTabbar',(path)=>{
		if(path.indexOf('index')>-1){
			this.active = 0;
		}else{
			this.active = 1;
		}
	})
  },
  beforeDestroy() {
  	this.bus.$off('refreshTabbar')
  },
  methods: {
    initActive() {
      const _this = this;
      //初始化active
      let params = window.location.hash;
	  // localStorage.getItem('tab') ||
      let hash = localStorage.getItem('tab')||params.substr(1);
      switch (hash) {
        case "/index":
          _this.active = 0;
          document.title = _this.tabbar[_this.active].text;
		  if(params.substr(1)!='/index'){
			_this.$router.replace("/index");
		  }
          break;
        case "/member":
          _this.active = 1;
          document.title = _this.tabbar[_this.active].text;
		  if(params.substr(1)!='/member'){
		  	_this.$router.replace("/member");
		  }
          break;
        default:
          _this.active = 0;
      }
    },
    tabChange(key) {
      const _this = this;
      switch (key) {
        case 0:
		  localStorage.setItem('tab','index')
          _this.$router.replace("/index");
          document.title = _this.tabbar[key].text;
          break;
        case 1:
		  localStorage.setItem('tab','member')
          _this.$router.replace("/member");
          document.title = _this.tabbar[key].text;
          break;
        default:
          break;
      }
    },
  },
};
</script>
